<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="MobileOptimized" content="320">
    <link type="text/css" rel="stylesheet" href="../css/index.css">
    <title>赢</title>
    <style type="text/css">

        .red_team p{
            margin-left: 14%;
        }
        .blue_team p{
            margin-right: 13%;
            right: 0;
            float: right;
        }
        .create_room {
            margin-top: 26em;
        }
        .drop_in {
            margin-top: 30em;
        }
    </style>
</head>
<body>
<div class="main">
    <div class="base">
        <div class="base_one"></div>
        <div class="base_two"></div>
        <div class="base_three"></div>
        <div class="base_four"></div>
        <div class="base_five"></div>
        <div class="base_six"></div>
        <div class="base_seven"></div>
        <div class="base_eight"></div>
        <div class="base_nine"></div>
        <div class="base_ten"></div>
    </div>
    <div class="judge_title">
        <img src="../img/judge_title.png">
        <p>OK珠海运动会</p>
    </div>
    <div class="both_team">
        <img src="../img/both_team_win.png" style="height: 14.5em;margin-top: .3em">
        <div class="red_team">
            <p>30</p>
        </div>
        <div class="blue_team">
            <p>30</p>
        </div>
    </div>
    <div class="win">
        <canvas id="cursor"></canvas>
        <!--<img src="../img/win.png">-->
    </div>
    <div class="create_room" style="width: 35%;margin-left: 32.5%; visibility: hidden">
        <img src="../img/drop_in_game.png">
        <p style="font-size: 22px">加油!!</p>
    </div>
    <div class="drop_in" style="width: 24%;margin-left: 38%; visibility: hidden">
        <img src="../img/publish.png">

        <p>发布</p>
    </div>

</div>
</body>
<script src="../js/jquery-1.9.1.min.js"></script>
<script src="../js/canvas.js"></script>
<script>
    var canvas = document.getElementById("cursor");
    var ctx = canvas.getContext("2d");
    //in the middle
    var middle_x = screen.width / 2 - 50;
    canvas.width = screen.width;

    var img = new Image();
    img.src = "../img/win.png";

    imgCvs = new imgCanvas(ctx, img, middle_x, 0);
    img.onload = function(){
        imgCvs.x = middle_x - 50;
        imgCvs.x = middle_x + 50;

        drawImg(ctx, canvas);
    }



</script>
</html>